@import 'public.less';
html,body{
    height: 100%;
    color: #585858;
    position: relative;
}

.header{
    .pxToRem(height,85);
    .pxToRem(padding-left,30);
    .pxToRem(padding-right,30);
    border-bottom: 1px solid #ececec;
    position: fixed;
    top:0;
    left: 0;
    width: 100%;
    z-index: 500;
    background: #fff;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    figure{
        .pxToRem(width,100);
        text-align: center;
        .pxToRem(line-height,85);
        img{
            width: 50%;
        }
    }
    ul{
        flex: 1;
        display: flex;
        justify-content: space-between;
        li{
            flex: 1;
            .pxToRem(font-size,30);
            text-align:center;
            .pxToRem(line-height,85);
            a{
                display: inline-block;
                .pxToRem(height,85);
                color: #585858;
                text-decoration: none;
            }
            .active{
                color: #000;
                border-bottom: 1px solid #000;
                box-sizing: border-box;
            }
        }
    }
}

.main{
    .pxToRem(padding-top,85);
    .pxToRem(padding-bottom,100);
    .dt_rm{
        background: #ebf0f2;
        figure:nth-child(1){
            width: 100%;
            img{
                width: 100%;
            }
        }
        .rm_cont{
            .pxToRem(margin-top,30);
            background: #fff;
            .pxToRem(padding-top,31);
            .pxToRem(padding-left,23);
            .pxToRem(padding-right,23);
            overflow: hidden;
            .list{
                float: left;
                width: 50%;
                .pxToRem(margin-bottom,20);
                .list_con{
                    .pxToRem(margin,10);
                    .list_banner{
                        width: 100%;
                        img{
                            width: 100%;
                        }
                    }
                    h2{
                        .pxToRem(margin-top,20);
                        .pxToRem(font-size,20);
                    }
                    .info{
                        .pxToRem(margin-top,30);
                        .pxToRem(height,45);
                        .pxToRem(line-height,45);
    
                        div{
                            float: left;
                            figure{
                                .pxToRem(width,45);
                                .pxToRem(height,45);
                                float: left;
                                img{
                                    width: 100%;
                                }
                            }
                            p{
                                float: left;
                                .pxToRem(margin-left,8);
                            }
                        }
                        p{
                            float: right;
                        }
                    }
                }
                
            }
        }
    }
    .dt_gz{
        background: #ebf0f2;
        .gz_fx{
            .pxToRem(height,80);
            .pxToRem(line-height,80);
            .pxToRem(padding-left,65);
            background: #fff url(../images/index-dt/close.png) no-repeat 2% center;
            .pxToRem(font-size,24);
            .pxToRem(background-size,24);
            // border-bottom: 1px solid #ccc;
            a{
                color: #75dbab;
                .pxToRem(padding-left,10);
            }
        }
        .gz_title{
            .pxToRem(margin-top,30);
            .pxToRem(height,80);
            display: flex;
            align-items: center;
            justify-content: space-between;
            background: #fff;
            border-bottom: 1px solid #ccc;
            .pxToRem(font-size,26);
            .pxToRem(padding-left,30);
            .pxToRem(padding-right,30);
            p:nth-child(2){
                background: #47d09c;
                border-radius: 30px;
                color: #fff;
                .pxToRem(width,100);
                text-align: center;
                opacity: 0.5;
            }
        }
        .gz_cont{
            background: #fff;
            .tj{
                .pxToRem(padding,30);
            }
            .gz_list{
                .pxToRem(padding-left,30);
                .pxToRem(padding-right,30);
                .list_dt{
                    border-bottom: 1px solid #ccc;
                    .pxToRem(margin-top,30);
                    .list_title{
                        display: flex;
                        figure{
                            .pxToRem(width,68);
                            .pxToRem(height,68);
                            img{
                                width: 100%;
                            }
                        }
                        div{
                            flex: 1;
                            .pxToRem(font-size,20);
                            .pxToRem(padding-left,20)
                        }
                        button{
                            .pxToRem(width,100);
                            .pxToRem(height,46);
                            background: #47d09c;
                            border: none;
                            border-radius: 30px;
                        }
                    }
                    .log_pic{
                        display: flex;
                        .pxToRem(margin-top,30);
                        figure{
                            flex: 1;
                            img{
                                width: 100%;
                            }
                        }
                        figure:nth-child(2){
                            .pxToRem(padding-left,15);
                            .pxToRem(padding-right,15);
                        }
                    }
                    .taste{
                        .pxToRem(padding-top,30);
                        .pxToRem(padding-bottom,40);
                    }
                }
                .list_dt:last-child{
                    border-bottom: none;
                }
            }
        }
    }
}

















.footer{
    .pxToRem(height,100);
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 500;
    background: #fff;
    border-top: 1px solid #ccc;
    a{
        display: block;
        height: 100%;
        width: 25%;
        float: left;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        color: #000;
        text-decoration: none;
        img{
            .pxToRem(width,35)
        }
        p{
            margin-top: 5%;
        }
    }
}